<!-- 选择零件号 -->
<template>
  <div id="dialog-container">
    <el-button  @click="dialogVisible = true">选择</el-button>
    <el-dialog v-dialogDrag :title="'选择零件号'" append-to-body :visible.sync="dialogVisible" :close-on-click-modal="false" width="680px">
      <el-form :model="formData" :inline="true" label-width="90px" size="small">
        <el-form-item label="零件号：">
          <el-input v-model="formData.partNumber"></el-input>
        </el-form-item>
        <el-form-item label="零件图号：">
          <el-input v-model="formData.partDrawingNumber"></el-input>
        </el-form-item>
        <el-form-item label="零件名称：">
          <el-input v-model="formData.partName"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary">查询</el-button>
        </el-form-item>
      </el-form>
      <el-table ref="multipleTable" :data="tableData" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="50" align="center"></el-table-column>
        <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
        <el-table-column prop="partNumber" label="零件号" width="" align="center"></el-table-column>
        <el-table-column prop="partDrawingNumber" label="零件图号" width="" align="center"></el-table-column>
        <el-table-column prop="partName" label="零件名称" align="center"></el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitChoose">确 定</el-button>
        <el-button @click="dialogVisible = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { getPartList } from 'service/task';
  export default {
    data() {
      return {
        dialogVisible: false,
        formData: {
          partNumber: '',
          partDrawingNumber: '',
          partName: '',
        },
        tableData: [],
        selectedpartNumber: '',
        selectedpartId: ''
        
      }
    },
    mounted() {
      this.showList();
    },
    methods: {
      showList() {
         getPartList({
          partNumber: this.formData.partNumber,
          partDrawingNumber: this.formData.partDrawingNumber,
          partName: this.formData.partName,
        }).then(res => {
          this.tableData =res.data.result.content;
        })
      },
      handleSelectionChange(val) {
        if(val.length > 1) {
          this.$alert('只能选择一条数据！', '提示', {
            type: 'error'
          })
        } else {
          this.selectedpartNumber = val[0].partNumber;
          this.selectedpartId =  val[0].id;
        }
      },
      // 确定
      submitChoose() {
        // console.log(9)
        if(this.selectedpartNumber === "") {
          this.$alert('请选择一条数据！', '提示', {
            type: 'warning'
          })
        } else {
          this.$emit("partVal", this.selectedpartNumber, this.selectedpartId);
          this.dialogVisible = false;
        }
      }
    }
  }

</script>
